{extend name='table'}

{block name="content"}
<form class="layui-form layui-card" action="{:request()->url()}" data-auto="true" method="post" autocomplete="off">
  <div class="layui-card-body">
    
    <!-- 积分规则配置 -->
    <fieldset class="layui-elem-field layui-field-title">
      <legend>积分规则配置</legend>
    </fieldset>
    
    <div class="layui-form-item">
      <label class="layui-form-label">单位分钟</label>
      <div class="layui-input-block">
        <input type="number" min="1" name="unit_minutes" required placeholder="例如：3" value="{$vo.unit_minutes|default=10}" class="layui-input">
        <div class="help-block">每满 N 分钟为 1 个单位（例如：3 表示每满3分钟为1个单位）。</div>
      </div>
    </div>

    <div class="layui-form-item">
      <label class="layui-form-label">通用积分</label>
      <div class="layui-input-block">
        <input type="number" min="1" name="unit_points" required placeholder="例如：1" value="{$vo.unit_points|default=1}" class="layui-input">
        <div class="help-block">每个单位记多少分（全局配置，作为兜底规则）。例如：单位分钟=3，通用积分=1，则每满3分钟记1分。</div>
      </div>
    </div>

    <div class="layui-form-item">
      <label class="layui-form-label">取整方式</label>
      <div class="layui-input-block">
        <select name="rounding">
          <option value="floor" {if isset($vo.rounding) && $vo.rounding=='floor'}selected{/if}>向下取整</option>
          <option value="round" {if isset($vo.rounding) && $vo.rounding=='round'}selected{/if}>四舍五入</option>
          <option value="ceil"  {if isset($vo.rounding) && $vo.rounding=='ceil'}selected{/if}>向上取整</option>
        </select>
        <div class="help-block">计算单位数时的取整方式（推荐：向下取整，不满1个单位不计算）。</div>
      </div>
    </div>

    <div class="layui-form-item">
      <label class="layui-form-label">超时作废</label>
      <div class="layui-input-block">
        <input type="number" min="0" name="timeout_minutes" placeholder="0 表示不启用" value="{$vo.timeout_minutes|default=0}" class="layui-input">
        <div class="help-block">超过该分钟数的进行中记录将判为"无效"，不计分。0 表示不启用。</div>
      </div>
    </div>
    
    <div class="layui-form-item">
      <label class="layui-form-label">积分有效期</label>
      <div class="layui-input-block">
        <input type="number" min="0" name="points_expire_days" placeholder="0 表示永久有效" value="{$vo.points_expire_days|default=0}" class="layui-input">
        <div class="help-block">积分的有效期（天），0 表示永久有效。</div>
      </div>
    </div>

    <div class="layui-form-item">
      <label class="layui-form-label">时间段积分</label>
      <div class="layui-input-block">
        <input type="hidden" name="time_slots" id="time-slots-json" value="{$time_slots_json|default=''}">
        <table class="layui-table" lay-size="sm" style="margin-bottom:8px;">
          <thead>
            <tr>
              <th style="width:140px">开始</th>
              <th style="width:140px">结束</th>
              <th style="width:160px">每单位积分</th>
              <th style="width:120px">操作</th>
            </tr>
          </thead>
          <tbody id="time-slots-rows"></tbody>
        </table>
        <button type="button" class="layui-btn layui-btn-sm" id="btn-add-slot">新增时间段</button>
        <div class="help-block">
          - 在该时间段内签到，每个单位记多少分（例如：2 表示每个单位记2分）。<br>
          - 如果签到时间不在任何时间段内，则使用"通用积分"。<br>
          - 支持跨午夜（如 22:00~02:00），时间按每日循环生效。
        </div>
      </div>
    </div>
    
    <!-- 语音播报配置 -->
    <fieldset class="layui-elem-field layui-field-title" style="margin-top:30px;">
      <legend>语音播报配置</legend>
    </fieldset>
    
    <div class="layui-form-item">
      <label class="layui-form-label">开始播报</label>
      <div class="layui-input-block">
        <input type="radio" name="voice_start" value="1" title="开启" {if !isset($vo.voice_start) || $vo.voice_start==1}checked{/if}>
        <input type="radio" name="voice_start" value="0" title="关闭" {if isset($vo.voice_start) && $vo.voice_start==0}checked{/if}>
        <div class="help-block">打卡开始时的语音播报。</div>
      </div>
    </div>
    
    <div class="layui-form-item">
      <label class="layui-form-label">结束播报</label>
      <div class="layui-input-block">
        <input type="radio" name="voice_end" value="1" title="开启" {if !isset($vo.voice_end) || $vo.voice_end==1}checked{/if}>
        <input type="radio" name="voice_end" value="0" title="关闭" {if isset($vo.voice_end) && $vo.voice_end==0}checked{/if}>
        <div class="help-block">打卡结束时的语音播报。</div>
      </div>
    </div>
    
    <script>
    layui.use(['jquery'], function(){
      var $ = layui.jquery;

      // 确保DOM已加载
      $(function(){
        var rowsBox = document.getElementById('time-slots-rows');
        var hidden = document.getElementById('time-slots-json');

        if(!rowsBox || !hidden){
          console.error('时间段积分初始化失败：找不到必要的DOM元素');
          return;
        }

        function addRow(data){
          data = data||{start:'',end:'',points_per_hour:1};
          var tr = document.createElement('tr');
          tr.innerHTML = '<td><input type="time" step="60" class="layui-input" value="'+(data.start||'')+'" data-field="start"></td>'+
                         '<td><input type="time" step="60" class="layui-input" value="'+(data.end||'')+'" data-field="end"></td>'+
                         '<td><input type="number" min="0" step="1" class="layui-input" value="'+(data.points_per_hour||0)+'" data-field="points_per_hour"></td>'+
                         '<td><button type="button" class="layui-btn layui-btn-danger layui-btn-xs" data-action="del">删除</button></td>';
          rowsBox.appendChild(tr);
        }

        function collect(){
          var arr=[]; var trs = rowsBox.querySelectorAll('tr');
          trs.forEach(function(tr){
            var s = tr.querySelector('[data-field="start"]').value.trim();
            var e = tr.querySelector('[data-field="end"]').value.trim();
            var p = parseFloat(tr.querySelector('[data-field="points_per_hour"]').value||'0');
            if(s&&e){ arr.push({start:s,end:e,points_per_hour:isNaN(p)?0:p}); }
          });
          hidden.value = arr.length?JSON.stringify(arr):'';
        }

        // 绑定事件
        $('#btn-add-slot').on('click', function(){ addRow(); });
        $(rowsBox).on('click', '[data-action="del"]', function(){ $(this).closest('tr').remove(); });

        // 表单提交前收集数据
        $('form.layui-form').on('submit', function(){ collect(); });

        // 初始化已有数据
        try{
          var raw = hidden.value || '';
          console.log('时间段积分原始值:', raw);

          if(raw){
            // 尝试修复可能的非标准JSON：单对象/缺失前置'['/HTML实体
            var val = raw.replace(/&quot;/g,'"').replace(/&amp;/g,'&').replace(/&#34;/g,'"');
            if(val && val[0] === '{' && val[val.length-1] === '}'){
              val = '[' + val + ']';
            } else if (val && val[0] !== '[' && val[val.length-1] === ']'){
              val = '[' + val;
            }

            var parsed = JSON.parse(val);
            console.log('解析后的数据:', parsed);

            // 修复：如果是关联数组对象（如 {"0":{...},"1":{...}}），转为真正的数组
            if(!Array.isArray(parsed) && parsed && typeof parsed === 'object'){
              var keys = Object.keys(parsed);
              // 检查是否是数字键的关联数组
              var isNumericKeys = keys.length > 0 && keys.every(function(k){ return /^\d+$/.test(k); });
              if(isNumericKeys){
                // 转为真正的数组
                var arr = [];
                keys.sort(function(a,b){ return parseInt(a) - parseInt(b); }).forEach(function(k){
                  arr.push(parsed[k]);
                });
                parsed = arr;
                console.log('修复关联数组为索引数组:', parsed);
              } else if(keys.indexOf('start') >= 0 && keys.indexOf('end') >= 0){
                // 单个对象，包装为数组
                parsed = [parsed];
              } else {
                parsed = [];
              }
            }

            if(Array.isArray(parsed)){
              parsed.forEach(function(item){
                console.log('添加行:', item);
                addRow(item);
              });
              console.log('成功加载 ' + parsed.length + ' 条时间段配置');
            }
          } else {
            console.log('时间段积分配置为空');
          }
        }catch(err){
          console.error('时间段积分初始化错误:', err);
        }
      });
    });
    </script>
  </div>

  <div class="layui-card-body text-center">
    <button class="layui-btn" type="submit">保 存</button>
    <button class="layui-btn layui-btn-primary" type="button" data-table-reload>返 回</button>
  </div>
</form>
{/block}

